So I'm creating a react app using firebase and my firebase.js file looks like this:

import firebase from 'firebase/compat/app';
import "firebase/auth";
export const auth = firebase.initializeApp({
    apiKey: "{my_key}",
    authDomain: "{domain}",
    projectId: "{project_id}",
    storageBucket: "{storage}",
    messagingSenderId: "{sender_id}",
    appId: "{app_id}",
    measurementId: "{blablabla}"
  }).auth();

And my Login.jsx:

import firebase from 'firebase/compat/app';

import { auth } from '../firebase';

<Button onClick={() => auth.signInWithRedirect(new firebase.auth.GoogleAuthProvider())}>

I want to sign in through google, as you can see, so I import auth from firebase.js, but when I do npm start I have the next error in console:

Uncaught TypeError: firebase_compat_app__WEBPACK_IMPORTED_MODULE_0__.default.initializeApp(...).auth is not a function

I'm not sure why it says that auth is not a function.

Edit: I also tried to import with require('firebase/auth') but it didn't help.